@import url('./conter/conter.less');
// 内容
.content{
    margin: 0 auto;
    width:100%;
    background-color: #ee6117;
    display: flex;
    >img{
        width: 900px;
    }
    .register{
        width: 501px;
        height: 703px;
        background-color: #fff;
        border-radius:0px 0px 17px 17px;
        padding: 0 15px;
        box-sizing: border-box;
        .register_box{
            height: 160px;
            width: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            border-bottom: 1px solid #707070;
            img{
                width: 311px;
            }
        }
        .register_box1{
            form{
                display: flex;
                flex-direction: column;
                align-items: center;
                >span{
                    margin-top: 21px;
                    font-size: 30px;
                    color: #707070;
                    margin-bottom: 26px;
                }
                >div:nth-of-type(1),>div:nth-of-type(2),>div:nth-of-type(3){
                    display: flex;
                    position: relative;
                    align-items: center;
                    width: 403px;
                    height: 50px;
                    box-sizing: border-box;
                    border: 1px solid #ee6117;
                    border-radius: 8px;
                    margin-bottom: 25px;
                    i{
                        width: 50px;
                        height: 50px;
                        border-right: 1px solid #ee6117 ;
                        box-sizing: border-box;
                        background: url(../images/登陆/账号-选中.png) no-repeat 50% 50%;
                        background-size: 21px;
                    }
                    input{
                        outline: none;
                        border: 0;
                        margin-left: 10px;
                        font-size: 15px;
                        color: #707070;
                    }
                    &::after{
                        content: '请输入邮箱/邮箱已注册/邮箱格式错误';
                        color: #f4720a;
                        font-size: 16px;
                        position: absolute;
                        bottom: -21px;
                        left: 0;
                    }
                }
                >div:nth-of-type(2),>div:nth-of-type(3){
                    border: 1px solid #707070;
                    i{
                        background-image: url(../images/登陆/面性密码锁-未选中.png);
                    }
                    &::after{
                        content: '请输入密码/密码格式为6-20字母数组组合';
                        color: #f4720a;
                        font-size: 16px;
                        position: absolute;
                        bottom: -21px;
                        left: 0;
                    }
                }
                >div:nth-of-type(3){
                    &::after{
                        content: '两次密码输入不一致，请重新输入';
                        color: #f4720a;
                        font-size: 16px;
                        position: absolute;
                        bottom: -21px;
                        left: 0;
                    }
                }
                >div:nth-of-type(4){
                    margin-top: 14px;
                    margin-bottom: 25px;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    p{
                        width: 250px;
                        height: 50px;
                        border: 1px solid #707070;
                        display: flex;
                        align-items: center;
                        border-radius: 8px;
                        input{
                            margin-left: 12px;
                            outline: none;
                            border: 0;
                            font-size: 15px;
                            color: #707070; 
                        }
                        position: relative;
                            &::after{
                                content: '验证码输入不正确，请重新输入';
                                color: #f4720a;
                                font-size: 16px;
                                position: absolute;
                                bottom: -21px;
                                left: 0;
                            }
                    }
                    span{
                        font-size: 33px;
                        color: #707070;
                        margin-left: 47px;
                    }
                }
                >div:nth-of-type(5){
                    margin-top: 15px;
                    display: flex;  
                    button{
                        width: 197px;
                        height: 50px;
                        border: 0;
                        background-color: #ee6117;
                        border-radius: 8px;
                        font-size: 15px;
                        color: #fff;
                        &:nth-of-type(2){
                            color: #666;
                            border: 1px solid #707070;
                            background-color: #fff;
                            margin-left: 10px;
                        }
                    } 
                }
            }
        }
    }
}